<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page import="java.util.*"%>
<%@page import="java.util.ArrayList"%>
<%@page import="com.mysql.jdbc.Driver"%>
<%@page import="java.sql.*"%>
<%@page import="com.mysql.jdbc.ResultSetMetaData"%>

<%! 
  String strTo(String st) throws Exception{ 
     byte[] bytes=st.getBytes("ISO-8859-1"); 
     String string=new String(bytes);
     return string;
  } 
  ArrayList<String[]> getDBItemNums(Connection conn)throws Exception{
	 ArrayList<String[]> list=new ArrayList<String[]>();
	 Statement st=conn.createStatement();
	 ResultSet rs=st.executeQuery("select * from comment");
	 while(rs.next()){ 
       list.add(new String[]{rs.getObject(2).toString(),rs.getObject(3).toString()});
	 }
	 return list;
  }
  void DBOperate(Connection conn,String clause)throws Exception{ 
	 Statement st=conn.createStatement();
	 int rs=st.executeUpdate(clause);
 }
 %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";

     Class.forName("com.mysql.jdbc.Driver"); 
    String url = "jdbc:mysql://localhost:3306/db_database10?characterEncoding=UTF-8"; 
    String user = "root"; 
    String password = "123"; 
    Connection conn = null;
    conn = DriverManager.getConnection(url,user,password); 

%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<link type="text/css" rel="stylesheet" href="css/style.css">
  <link rel="stylesheet" href="css/bgstretcher.css">
<link rel="stylesheet" href="css/demo.css">
    <base href="<%=basePath%>">
    
    <title>My JSP 'home.jsp' starting page

    </title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="in.css">
	-->
<SCRIPT src="js/jquery.min.js" type=text/javascript></SCRIPT>
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
<script type="text/javascript" src="js/jquery-bgstretcher-3.0.1.min.js"></script>
<script type="text/javascript">
        jQuery(function($){
            $("body").bgStretcher({
                images: ["images/sample-2.jpg"],
                imageWidth: 1600,
                imageHeight: 1200
            })
        });
    </script>

<SCRIPT type=text/javascript>
$(document).ready(function() {	
	$("#menu1 li").prepend("<span></span>"); //Throws an empty span tag right before the a tag
	
	$("#menu1 li").each(function() { //For each list item...
		var linkText = $(this).find("a").html(); //Find the text inside of the a tag
		$(this).find("span").show().html(linkText); //Add the text in the span tag
	}); 
	
	$("#menu1 li").hover(function() {	//On hover...
		$(this).find("span").stop().animate({ 
			marginTop: "-40" //Find the span tag and move it up 40 pixels
		}, 250);
	} , function() { //On hover out...
		$(this).find("span").stop().animate({
			marginTop: "0" //Move the span back to its original state (0px)
		}, 250);
	});	
	
	/*	2nd example	*/
	$("#menu2 li").prepend("<span></span>"); //Throws an empty span tag right before the a tag
	
	$("#menu2 li").each(function() { //For each list item...
		var linkText = $(this).find("a").html(); //Find the text inside of the a tag
		$(this).find("span").show().html(linkText); //Add the text in the span tag
	}); 
	
	$("#menu2 li").hover(function() {	//On hover...
		$(this).find("span").stop().animate({ 
			marginTop: "-40" //Find the span tag and move it up 40 pixels
		}, 250);
	} , function() { //On hover out...
		$(this).find("span").stop().animate({
			marginTop: "0" //Move the span back to its original state (0px)
		}, 250);
	});	
});
</SCRIPT>

  </head>
  <script language="javascript">
    function loadMsg(){ 
    var table=document.getElementById("comment");
    table
    }
	function addElement() {
	//创建TextNode节点
	var person_name=form1.person.value;
	var comment_content=form1.content.value;
	var person = document.createTextNode(person_name);
	var content = document.createTextNode(comment_content);	
	//创建td类型的Element节点
	var td_person = document.createElement("td"); 
	var td_content = document.createElement("td");	
	var tr = document.createElement("tr"); //创建一个tr类型的Element节点
	var tbody = document.createElement("tbody"); //创建一个tbody类型的Element节点
	//将TextNode节点加入到td类型的节点中
	td_person.appendChild(person);
	td_content.appendChild(content);	
	//将td类型的节点添加到tr节点中
	tr.appendChild(td_person);
	tr.appendChild(td_content);	
	tbody.appendChild(tr); //将tr节点加入tbody中
	var tComment = document.getElementById("comment"); //获取table对象
	tComment.appendChild(tbody); //将节点tbody加入节点尾部
	form1.person.value="";	//清空评论人文本框
	form1.content.value="";		//清空评论内容文本框
	var flag="add";
	location.href="Transfer.jsp?name="+person_name+"&content="+comment_content+"&flag="+flag;  
}
//删除第一条评论
function deleteFirstE(){
	var tComment = document.getElementById("comment"); //获取table对象
	var person_name="";
	if(tComment.rows.length>1){
	    person_name=tComment.rows[1].cells[0].innerText;
		tComment.deleteRow(1);		//删除表格的第二行，即第一条评论，
	}
	
	var flag="minus";
	location.href="Transfer.jsp?name="+person_name+"&content=nothing"+"&flag="+flag;
}
//删除最后一条评论
function deleteLastE(){
	var tComment = document.getElementById("comment"); //获取table对象
	var person_name="";
	if(tComment.rows.length>1){
		person_name=tComment.rows[tComment.rows.length-1].cells[0].innerText;
		tComment.deleteRow(tComment.rows.length-1);	//删除表格的最后一行，即最后一条评论
	}
		var flag="minus";
	location.href="Transfer.jsp?name="+person_name+"&content=nothing"+"&flag="+flag;
}
	</script>
  
  <body>
  <%
  String name=(String)session.getAttribute("name"); 
     if(name==null) response.sendRedirect("cache.jsp");%>
  <span style="color:white">欢迎你：<%=name %></span>
<div align="right"><a href="revoke.jsp" >退出当前账号</a></div>
<hr>
  <div id="menu1">
  <ul>
	<li><a href="home.jsp">首　　 页</a></li>
	<li><a href="serv.jsp">服          务</a></li>
	<li><a href="sasion.jsp">留  言   板</a></li>
	<li><a href="person.jsp">成           绩</a></li>
		
  </ul>
  <div class="cls"></div>
</div>
  
  <br>
   <table width="600" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#FFFFFF" bordercolorlight="#666666" bordercolordark="#FFFFFF" id="comment">
     <tr>
	   <td width="18%" height="27" align="center" >留言人</td>
	   <td width="82%" align="center" >留言内容</td>
     </tr>
     <% 
        ArrayList<String[]> list=getDBItemNums(conn);
        for(int i=0;i<list.size();i++){ 
      %>
      <tr >
	   <td width="18%" ><%=list.get(i)[0] %></td>
	   <td width="82%" ><%=list.get(i)[1]  %></td>
      </tr>
     <%} %>
   </table>
   <form name="form1" method="post" action="">    
     <table width="600" height="122" border="0" align="center" cellpadding="0" cellspacing="0">
       <tr>
         <td width="119" height="14">&nbsp;</td>
         <td width="481">&nbsp;</td>
       </tr>
       <tr>
         <td height="27" align="center">留  言   人：</td>
         <td>
           <input name="person" type="text" id="person" size="40">
         </td>
       </tr>
       <tr>
         <td align="center">留言内 容：</td>
         <td><textarea name="content" cols="60" rows="6" id="content"></textarea></td>
       </tr>
       <tr>
         <td height="40">&nbsp;</td>
         <td><input name="Button" type="button" class="btn_grey" value="发表" onClick="addElement()" >
          &nbsp;
         <input name="Reset" type="reset" class="btn_grey" value="重置">
          &nbsp;
         <input name="Button" type="button" class="btn_grey" value="删除第一条评论" onClick="deleteFirstE()">
         &nbsp;
         <input name="Button" type="button" class="btn_grey" value="删除最后一条评论" onClick="deleteLastE()"></td>
       </tr>
    </table>
  </form>
 </body>
</html>
